<template>

  <el-dialog title="订单计费重算" :visible.sync="dialogFormVisible" width="1120px" @close="fmsOrderId=''">
    <el-form :model="formValue" label-width="120px" style="margin-top: 20px;">

      <el-row >
        <el-col  style="width: 100%;">
          <el-form-item :label="$tt('客户信息')">
            <div style="display: flex;">
              <div>[{{fmsOrder.customerCode}}] {{fmsOrder.customerName}}</div>
              <div style="margin-left: 50px;">{{$tt('产品信息')}}</div>
              <div style="margin-left: 10px;">[{{fmsOrder.productCode}}] {{fmsOrder.productName}}</div>
            </div>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- 物流杂费-->
      <el-row >
        <el-col  style="width: 80%;">
          <el-form-item :label="$tt('订单信息')" >
            <el-descriptions   direction="vertical" :column="5" border >
              <el-descriptions-item :label="$tt('订单类型-编号')">[{{fmsOrder.refOrderType}}] {{fmsOrder.refOrderNo}}</el-descriptions-item>
              <el-descriptions-item :label="$tt('实际重量')">{{ orderStatis.weight}} Kg</el-descriptions-item>
              <el-descriptions-item :label="$tt('体积')">{{ orderStatis.volume}} Cbm</el-descriptions-item>
              <el-descriptions-item :label="$tt('sku件数')">{{ orderStatis.skuNums}}</el-descriptions-item>
              <el-descriptions-item :label="$tt('箱数')">{{ orderStatis.packageNums}}</el-descriptions-item>
            </el-descriptions>

          </el-form-item>
        </el-col>
      </el-row>

      <el-row >
        <el-col  style="width: 100%;">
          <el-form-item :label="$tt('当前物流费用')">

            <ex-table-auto class="el-table-nowwarp" ref="omsOnlinePriceCfg"
                           :url="'/fms-api/customer/CustomerBillDetailRpc/selectByFmsOrder.json?fmsOrderId=' + fmsOrderId + '&billCategory=TRANSPORT' "
                           :autoFill="false"
                           :autoPage="false"
                           :autoLoad="true"
                           border>
              <el-table-column type="index" label="#" width="43"></el-table-column>

              <el-table-column prop="serviceName" :label="$tt('label_fms_service_code_expense_item_name')" min-width="8"></el-table-column>
              <el-table-column prop="serviceAmount" :label="$tt('label_fms_subject_expense_amount')" min-width="8" align="right"></el-table-column>
              <el-table-column prop="discountAmount" :label="$tt('label_fms_subject_discounts_amount')" min-width="8" align="right"></el-table-column>
              <el-table-column prop="actualAmount" :label="$tt('label_fms_subject_actual_amount')" min-width="8" align="right"></el-table-column>
              <el-table-column prop="happenTime" :label="$tt('label_fms_account_log_create_time')" min-width="12" align="center">
                <template slot-scope="scope">
                  {{ $dateFormat(scope.row.happenTime) }}
                </template>
              </el-table-column>
              <el-table-column prop="status" :label="$tt('label_fms_account_apply_status')" min-width="8" align="center">
                <template slot-scope="scope">
                  {{ $enumShow(scope.row.status, 'FmsBillDetailStatus') }}
                </template>
              </el-table-column>

            </ex-table-auto>


          </el-form-item>
        </el-col>

      </el-row>


      <el-row >
        <el-col  style="width: 100%;">
          <el-form-item :label="$tt('价卡名称')">
            {{ formValue.versionName }}
          </el-form-item>
        </el-col>
      </el-row>

      <el-row >
        <el-col  style="width: 100%;">
          <el-form-item :label="$tt('价卡配置')">
            <el-select v-model="formValue.versionPriceId" placeholder="请选择价卡配置" style="width: 280px;">
              <el-option
                v-for="item in priceVersions"
                :key="item.priceId"
                :label="$dateFormatDate(item.versionStartTime)"
                :value="item.priceId">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row >
        <el-col  style="width: 100%;">
          <el-form-item :label="$tt('版本记录')">
            <el-select v-model="formValue.versionPriceTag" placeholder="请选择版本记录" style="width: 280px;">
              <el-option
                v-for="item in priceVersionHistory"
                :key="item.tagTime"
                :label="item.creator + ' - ' + $dateFormat(item.tagTime)"
                :value="item.tagTime">

                <span style="float: left">{{ item.creator }}</span>
                <span style="float: right; color: #8492a6; font-size: 14px">{{ $dateFormat(item.tagTime) }}</span>

              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>

    </el-form>

    <div slot="footer" class="dialog-footer">

      <el-button @click="dialogFormVisible = false">取 消</el-button>

      <el-button type="primary" @click="submitPrice()">确定重算</el-button>

    </div>

  </el-dialog>

</template>


<script>

  import FmsCurrencyChoose from '@/component/fms/fms-currency-choose.vue'

  import PmsPricePoint from '@/component/pms/pms-price-point.vue'

  export default {
    name: 'warehouse_select',

    components: {FmsCurrencyChoose, PmsPricePoint},

    data() {
      return {

        "dialogFormVisible": false,

        "fmsOrderId": '',
        "fmsOrder": {
        },
        "orderStatis": {

        },
        "formValue": {
          "id": '',
          "versionId": '',
          "versionName": '',
          "versionPriceId": '',
          "versionPriceTag": '',
        },

        "priceVersions": [],

        "priceVersionHistory": [],
        "priceVersionsMap": {}

      }
    },

    watch: {
      'formValue.versionPriceId'(val, old){
        // console.log(val)
        // console.log(JSON.stringify(this.priceVersionsMap))
        // console.log(this.priceVersionsMap[val])
        if(this.priceVersionsMap[val + '']){
          this.priceVersionHistory = this.priceVersionsMap[val + '']
        }


        let currentPriceTag = this.priceVersionHistory.filter(e=>e.tagTime == this.formValue.versionPriceTag)

        if(!currentPriceTag || currentPriceTag.length == 0){
          this.formValue.versionPriceTag = ''
        }

      },

      'formValue.versionPriceTag'(val, old){
      }

      // 'productType'(val, old) {
      // },
    },

    props:{

    },

    created() {

      let _this = this


    },

    methods: {


      submitPrice(){

        let _this = this

        _this.$ajax({
          url: '/fms-api/customer/CustomerOrderRpc/submitOrderPriceVersionChange.json',
          type: 'json',
          data: _this.formValue,
          success: (res) => {
            _this.$message({
              type: 'success',
              message: '提交成功'
            })
            _this.dialogFormVisible = false
            _this.$emit('afterSubmit')
          }
        });

      },

      showConfig(fmrOrder){

        console.log(fmrOrder)

        let _this = this

        _this.fmsOrder = fmrOrder
        _this.fmsOrderId = fmrOrder.id

        // _this.$refs['omsOnlinePriceCfg'].loadData()

        _this.$ajax({
          url: '/fms-api/product/PmsTransportPriceRpc/productVersions.json',
          data:{
            productId: fmrOrder.productId,
            versionId: fmrOrder.versionId,
          },
          success: (res) => {
            if (res && res.data && res.data.rows) {
              _this.priceVersions =  res.data.rows
              _this.priceVersionsMap = {}
              _this.priceVersions.forEach(rr=>{
                // console.log(JSON.stringify(rr))
                _this.priceVersionsMap[rr.priceId + ''] = rr.priceHistories
              })

              _this.formValue.id = fmrOrder.id
              _this.formValue.versionId = fmrOrder.versionId
              _this.formValue.versionName = fmrOrder.versionName
              _this.formValue.versionPriceId = fmrOrder.versionPriceId
              _this.formValue.versionPriceTag = fmrOrder.versionPriceTag

            }

            this.dialogFormVisible = true
          }
        });

        _this.$ajax({
          url: '/fms-api/customer/CustomerOrderRpc/order_statis.json',
          data:{
            id: _this.fmsOrder.id
          },
          success: (res) => {
            if (res && res.data) {
              _this.orderStatis = res.data
            }
            this.dialogFormVisible = true
          }
        });

      },

      getFormPriceLabel(){
        if(this.formValue.transportMainPrice.priceType=='ADD' ){
          return this.$tt('label_pms_add_price_cfg')
        }
        if(this.formValue.transportMainPrice.priceType=='TOTAL'){
          return this.$tt('label_pms_total_price_cfg')
        }
        if(this.formValue.transportMainPrice.priceType=='MULTI_ADD'){
          return this.$tt('首重+续重配置')
        }

        return ''
      },
      getChargeLabel(){
        if (this.formValue.transportMainPrice.chargeType == 'WEIGHT' || this.formValue.transportMainPrice.chargeType == 'CAL_WEIGHT') {
          return "重量"
        }
        if (this.formValue.transportMainPrice.chargeType == 'VOLUME') {
          return "体积"
        }
      },
      afterChange(val) {
        this.$emit('input', val)
      }

    }
  }
</script>
<style>
  .price-cal-div-row {
    display: flex;
  }

  .price-cal-div-row .price-cal-col {
    width: 120px;
    text-align: center;
  }

  .price-cal-div-row div {
    margin-right: 8px;
    text-align: center;
  }

  .price-edit-inner-input {
    text-align: center;
    height: 30px;
    line-height: 30px;
    font-size: 14px;
    border-radius: 4px;
    border: 1px solid #DCDFE6;
  }

</style>
